<template>
	<view class="content">
		<u-navbar leftText="返回" title="头号玩家":safeAreaInsetTop="true" :placeholder="true" bgColor="#fe8281">
			<view class="u-nav-slot"slot="left" >
				
			</view>
			<view  class="u-nav-slot" slot="center">
			   <view>&nbsp;</view>
			</view>
			
		</u-navbar>
		<view class="banner-box">
			<view class="user-box">
				<image src="http://120.46.33.25:9110/profile/images/images/toux.jpg"  class="tx"></image>
					<view class="user-name-box">
						<view class="user-name">用户名</view>
						<view class="user-sign">卡集号:123456</view>						
					</view>
					<view style="float: right;">
						<view class="setting-icon" @click="goPage('/pages/myaccount/myaccount')">
							<u-icon  name="setting-fill" color="#fff" size="20"></u-icon>	
						</view>
						<view class="clear"></view>
					</view>
					<view class="clear"></view>
					
					<view class="order-box">
						<view class="order-tit">我的订单</view>
						<view class="order-more"  @click="goPage('/pages/order/order?current=0')">更多订单></view>
						<view class="clear"></view>
						<view class="order-menu"  @click="goPage('/pages/order/order?current=1')">
							<view class="badge-box">
							<u-badge  max="99" :value="1" shape="horn" :offset="[-7,14]" :absolute="true"></u-badge>
							</view>
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/order-icon1.png" mode="widthFix"></image>
							<view>待付款</view>
						</view>
						<view class="order-menu"  @click="goPage('/pages/order/order?current=2')">
							<view class="badge-box">
								<u-badge  max="99" :value="1" shape="horn" :offset="[-7,14]" :absolute="true"></u-badge>
							</view>
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/order-icon2.png" mode="widthFix"></image>
							<view>待发货</view>
						</view>
						<view class="order-menu"  @click="goPage('/pages/order/order?current=3')">
							<view class="badge-box">
								<u-badge  max="99" :value="1" shape="horn" :offset="[-7,14]" :absolute="true"></u-badge>
							</view>
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/order-icon3.png" mode="widthFix"></image>
							<view>待收货</view>
						</view>
						<view class="order-menu"  @click="goPage('/pages/order/order?current=4')">
							<view class="badge-box">
								<u-badge  max="99" :value="1" shape="horn" :offset="[-7,14]" :absolute="true"></u-badge>
							</view>
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/order-icon4.png" mode="widthFix"></image>
							<view>退款/售后</view>
						</view>
					</view>
					<view class="often-box">
						<view class="order-tit">常用服务</view>
						<view class="clear"></view>
						<view class="order-menu" @click="goPage('/pages/vip/vip')">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/often-icon1.png" mode="widthFix"></image>
							<view>会员中心</view>
						</view>
						<view class="order-menu" @click="goPage('/pages/address/address')">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/often-icon2.png" mode="widthFix"></image>
							<view>收货地址</view>
						</view>
						<view class="order-menu" @click="goPage('/pages/myCollect/myCollect')">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/often-icon3.png" mode="widthFix"></image>
							<view>我的收藏</view>
						</view>
						<view class="order-menu" @click="goPage('/pages/pointsMall/pointsMall')">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/often-icon6.png" mode="widthFix"></image>
							<view>积分商城</view>
						</view>
						<view class="order-menu" @click="goPage('/pages/ticket/ticket?order=false')">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/often-icon5.png" mode="widthFix"></image>
							<view>优惠券</view>
						</view>
						<view class="order-menu" @click="customerBtn">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/often-icon4.png" mode="widthFix"></image>
							<view>官方客服</view>
							<button class="customer-btn"	ref="customerBtn" open-type='contact'></button>
						</view>
					</view>
					<view class="often-box">
						<view class="order-tit">更多服务</view>
						<view class="clear"></view>
						<view class="order-menu" @click="customerBtn">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/more-icon1.png" mode="widthFix"></image>
							<view>商务合作</view>
							<button class="customer-btn"	ref="customerBtn" open-type='contact'></button>
						</view>
						<view class="order-menu"  @click="goPage('/pages/agent/agent')">
							<image class="img" src="http://120.46.33.25:9110/profile/images/images/more-icon2.png" mode="widthFix"></image>
							<view>代理中心</view>
						</view>
					</view>
			</view>
			
		</view>
		
		
		
		
		
		
		<u-loading-page  style="z-index: 99999;" :loading="loading" bg-color="rgba(0,0,0,0.5)" loading-text="加载中..."></u-loading-page>
		<u-toast ref="saveToast"></u-toast>
	</view>
</template>

<script>
	export default {
		
		data() {
			return {
				loading:false,
				orderData:{},
				userInfo: uni.getStorageSync("userInfo"),
				imgFlag:false,
				agentFlag:false,
				agentData:[],
				agentNameFlag:false,
				parentInfo:{}
			}
		},
		onShow(){
			// this.userInfo=uni.getStorageSync("userInfo")
			// this.getOrderNum()
			// this.getUserInfo()
		},
		mounted(){
			// this.getAgentPrice()
			// if(uni.getStorageSync("userInfo").appletParentAgency!=0){
			// 	this.getParentInfo()
			// }
			
		},
		methods: {
			// 通过id获取用户信息
			getParentInfo(){
				this.$apis.getByAppletUserId({
					appletUserId:uni.getStorageSync("userInfo").appletParentAgency
				}).then(res => {
					if(res.code==200){
						this.parentInfo=res.data
						this.agentNameFlag=true
					}else{
						
						this.$refs.saveToast.show({
							position:'center',
							type: 'error',
							message: res.msg,
						})
					}
					
				}).catch(err=>{
					console.log(err)
							
				})
				
			},
			//获取代理价格
			getAgentPrice(){
				this.$apis.getUserLevelMoneyAll().then(res => {
					if(res.code==200){
						this.agentData=res.data
						
					}else{
						
						this.$refs.saveToast.show({
							position:'center',
							type: 'error',
							message: res.msg,
						})
					}
					
				}).catch(err=>{
					console.log(err)
							
				})
			},
			// 开通代理
			addAgent(userType){
				
				// 付款
				
					var that=this
					var goodsName={
						userId:uni.getStorageSync("userInfo").appletUserId,
						openId:uni.getStorageSync("userInfo").appletUserOpenid,
						orderId:that.orderData.appletOrderId,
					}
					let params={ 
						openId:uni.getStorageSync("userInfo").appletUserOpenid,
						userType:userType,
						orderType:2,
						appletUserId:uni.getStorageSync("userInfo").appletUserId,
						goodsName:'头号玩家代理费'
					  }
					this.$apis.createOrder(params).then(res => {
						if(res.code==200){
							//  //调用微信官方支付接口弹出付款界面,输入密码扣款
							 wx.requestPayment({
							   timeStamp: res.data.timeStamp.toString(),  //后端返回的时间戳
							   nonceStr:  res.data.nonceStr,   //后端返回的随机字符串
							   package:  res.data.prepayId, //后端返回的prepay_id
							   signType: 'RSA', //后端签名算法,根据后端来,后端MD5这里即为MD5
							   paySign:  res.data.paySign,  //后端返回的签名
							   success (res) {
									// that.payOrder()
									that.loading=true
									that.imgFlag=false
									setTimeout(function() {
										
										that.loading=false
									    // 这里写需要执行的代码
										that.agentFlag=true
										that.getUserInfo()
									}, 3000);
									
							     console.log('用户支付扣款成功', res)
							   },
							   fail (res) { 
							     console.log('用户支付扣款失败', res)
							   }
							  })
						}else{
							
							this.$refs.saveToast.show({
								position:'center',
								type: 'error',
								message: res.msg,
							})
						}
						
					}).catch(err=>{
						console.log(err)
								
					})
					
					
					
					 
					  
					 
					
				
				
				
				
				// let body={
				// 	appletOpenAgency:'210',
				// 	appletUserId:uni.getStorageSync("userInfo").appletUserId
				// }
				// this.$apis.saveUserAgency(body).then(res => {
				// 	if(res.code==200){
				// 		this.agentFlag=true
				// 		this.getUserInfo()
						
				// 	}else{
						
				// 		this.$refs.saveToast.show({
				// 			position:'center',
				// 			type: 'error',
				// 			message: res.msg,
				// 		})
				// 	}
					
				// }).catch(err=>{
				// 	console.log(err)
							
				// })
			},
			
			// 获取用户信息
			getUserInfo(){
				 let body={
					 appletUserOpenid:uni.getStorageSync("customer").appletUserOpenId
				 }
				 this.$apis.getByAppletUserOpenId(body).then(res => {
					if(res.code==200){
						uni.setStorageSync('userInfo', res.data)
						this.userInfo=res.data
					}else{
						
						this.$refs.saveToast.show({
							position:'center',
							type: 'error',
							message: res.msg,
						})
					}
					
				 }).catch(err=>{
					console.log(err)
							
				 })
							 
			},
			getOrderNum(){
				let body={
					appletUserId:uni.getStorageSync("userInfo").appletUserId
				}
				this.$apis.countAppletOrderStatus(body).then(res => {
					if(res.code==200){
						this.orderData=res.data
						
					}else{
						
						this.$refs.saveToast.show({
							position:'center',
							type: 'error',
							message: res.msg,
						})
					}
					
				}).catch(err=>{
					console.log(err)
							
				})
			},
			goPage(url){
				if(uni.getStorageSync("userInfo").appletOpenAgency!='210' && url=='/pages/agent/agent'){
					this.imgFlag=true
				}else{
					uni.navigateTo({
					    //保留当前页面，跳转到应用内的某个页面
					    url: url
					})
				}
				
				
			},
		}
	}
</script>
<style>
	page{
		background:#f5f5f5;
		padding-bottom: 40rpx;
	}
</style>
<style>
	.clear{
		clear: both;
	}
.banner-box{
	width: 100%;
	background: linear-gradient(to bottom, #fe8281, #f5f5f5);
	height: 686rpx;
	padding: 0 30rpx;
	box-sizing: border-box;
	
}
.setting-icon{
	float: right;
}
.user-box{
	padding-top: 16rpx;
	
}
.tx{
	border: 1px solid #fff;
	width: 128rpx;
	height: 128rpx;
	border-radius: 100px;
	float: left;
	
}
.user-name-box{
	float: left;
	margin-left: 20rpx;
	overflow: hidden;
	
}
.user-name{
	color: #fff;
	font-size: 44rpx;
	font-weight: bold;
	margin-top: 10rpx;
}
.user-sign{
	color: #fff;
	font-size: 24rpx;
}
.signIn{
	float: right;
	line-height: 50rpx;
	color: #fff;
	margin-top: 20rpx;
	border: 1px solid #fff;
	border-radius: 5px;
	padding-left: 60rpx;
	padding-right: 20rpx;
	font-weight: bold;
	font-size: 28rpx;
}
.signIn{
	background: url('http://120.46.33.25:9110/profile/images/images/sign-icon_03.png') 8rpx 2rpx no-repeat;
	background-size: 44rpx;
}
.order-box{
	width: 692rpx;
	height: 244rpx;
	background-color: #fff;
	margin-top: 60rpx;
	border-radius: 10rpx;
	overflow: hidden;
}
.order-tit{
	font-weight: bold;
	font-size: 36rpx;
	margin-top: 26rpx;
	margin-left: 26rpx;
	float: left;
}
.order-more{
	float: right;
	margin-top: 34rpx;
	margin-right: 26rpx;
	color: #575757;
	font-size: 28rpx;
}
.order-menu{
	width: 25%;
	float: left;
	text-align: center;
	margin-top: 30rpx;
	position: relative;
}
.order-menu .img{
	width: 58rpx;
	display: block;
	margin: 0 auto;
}
.order-menu view{
	font-size: 28rpx;
	margin-top: 8rpx;
}
.often-box{
	width: 692rpx;
	background-color: #fff;
	margin-top: 30rpx;
	border-radius: 10rpx;
	overflow: hidden;
	padding-bottom: 10rpx;
}
.player-con-btn{
		margin-top: 6rpx;
		text-align: center;
		margin-bottom: 20rpx;
		color: #fff;
		background: #ff7187;
		line-height: 70rpx;
		border-radius: 16rpx;
		float: left;
		width: 271rpx;
		margin-left: 10rpx;
		font-size: 28rpx;
	}
		.agent-img{
			
		}
		.imgBox{
			position: relative;
			width: 570rpx;
		}
		.agent-price{
			position: absolute;
			font-size: 28rpx;
			top: 582rpx;
			right: 42rpx;
		}
		.agent-price text{
			font-size: 32rpx;
			font-weight: bold;
		}
		.agent-tit{
			position: absolute;
			top: 630rpx;
			right: 42rpx;
			font-size: 32rpx;
			
		}
		.agent-con{
			position: absolute;
			top: 680rpx;
			right: 42rpx;
			font-size: 20rpx;
			text-align: right;
		}
		.agent-icon{
			position: absolute;
			width: 298rpx;
			height: 203rpx;
			top: 77rpx;
			right: 0;
			left: 0;
			margin: auto;
			display: block;
		}
		.agent-success-con{
			position: absolute;
			width: 100%;
			text-align: center;
			top: 286rpx;
			font-size: 40rpx;
		}
		.float-close{
			position: absolute;
			right: 20rpx;
			top: 20rpx;
			z-index: 1;
		}
		.agent-success-btn{
			position: absolute;
			width: 432rpx;
			line-height: 70rpx;
			background-color: #EC6F99;
			text-align: center;
			color: #fff;
			right: 0;
			left: 0;
			margin: auto;
			border-radius: 35rpx 35rpx 35rpx 35rpx;
			top: 398rpx;
			font-size: 40rpx;
		}
		.customer-btn{
			font-size: 28rpx;
			margin-top: 8rpx;
			background: none;
			border: 0;
			padding:0;
			line-height: 40rpx;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			
		}
		.customer-btn:after{
			border: 0;
		}
.player-box{
		padding: 0 30rpx;
		
	}
	.player-tit{
		text-align: center;
		font-size: 32rpx;
		padding: 20rpx 0;
		font-weight: bold;
	}
	.player-con{
		
		line-height: 50rpx;
		font-size: 28rpx;
		text-indent: 2em;
	}
	.player-con-btn{
		margin-top: 20rpx;
		text-align: center;
		margin-bottom: 20rpx;
		color: #fff;
		background: #ff7187;
		line-height: 70rpx;
		border-radius: 16rpx;
	}
	.player-con-box{
		max-height: 600rpx;
		overflow-y: scroll;
	}
</style>
